.board_page {
  .fade_animition_center {
    animation: fade_animition_center 0.8s;
    @keyframes fade_animition_center {
      from {
        bottom: 2%;
        opacity: 0;
      }
      to {
        bottom: 20%;
        opacity: 1;
      }
    }
  }

  .fade_animition_left {
    animation: fade_common_left 0.8s;
    @keyframes fade_common_left {
      from {
        left: 0;
        opacity: 0;
      }
      to {
        left: 2%;
        opacity: 1;
      }
    }
  }

  .fade_animition_right {
    animation: fade_common_right 0.8s;
    @keyframes fade_common_right {
      from {
        right: 0;
        opacity: 0;
      }
      to {
        right: 2%;
        opacity: 1;
      }
    }
  }

  .bottom_center {
    padding: 0.5rem /* 40/16 */ 1.25rem /* 20/16 */;
    display: inline-block;
    position: absolute;
    bottom: 20%;
    left: 32%;
    z-index: 2;
    width: 44rem /* 392/16 */;
    height: auto;
    animation: name duration timing-function delay iteration-count direction fill-mode;
  }

  .left {
    padding: 2.5rem /* 40/16 */ 1.25rem /* 20/16 */;
    display: inline-block;
    position: absolute;
    top: 2%;
    z-index: 2;
    width: 28.5rem /* 392/16 */;
    height: auto;
    animation: name duration timing-function delay iteration-count direction fill-mode;
  }

  .left-close2 {
    -webkit-transform: translateX(-31.4rem);
    transform: translateX(-29.6rem);
    -webkit-transition: -webkit-transform 0.7s ease;
    transition: transform 0.7s ease;
  }
  .left-close {
    -webkit-transform: translateX(-31.4rem);
    transform: translateX(-31.4rem);
    -webkit-transition: -webkit-transform 0.7s ease;
    transition: transform 0.7s ease;
  }
  .left-open {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform 0.8s ease;
    transition: transform 0.8s ease;
  }

  .leftOpenOrClose {
    cursor: pointer;
    width: 30px;
    height: 80px;
    background: rgba(23, 36, 63, 0.7);
    position: absolute;
    top: 45%;
    z-index: 99;
    text-align: center;
    border-radius: 0px 10px 10px 0px;
    line-height: 80px;
    color: white;
    img {
      width: 50%;
      height: 25%;
      margin-top: 60%;
      display: inline-block;
      text-align: center;
      box-sizing: border-box;
    }
  }

  .leftOpenOrClose-open {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
  }

  .leftOpenOrClose-close {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
  }

  .right {
    padding: 2.5rem /* 40/16 */ 1.25rem /* 20/16 */;
    display: inline-block;
    position: absolute;
    top: 25%;
    right: 0%;
    z-index: 2;
    width: 24.5rem /* 392/16 */;
    height: auto;
    animation: name duration timing-function delay iteration-count direction fill-mode;
  }

  .right-open {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
  }
  .right-close {
    -webkit-transform: translateX(24.2rem);
    transform: translateX(24.2rem);
    -webkit-transition: -webkit-transform 0.8s ease;
    transition: transform 0.8s ease;
  }
  .rightOpenOrClose {
    cursor: pointer;
    width: 30px;
    height: 80px;
    background: rgba(23, 36, 63, 0.7);
    position: absolute;
    left: -12.9%;
    top: 35%;
    border-radius: 10px 0px 0px 10px;
    text-align: center;

    color: white;
    img {
      width: 50%;
      height: 25%;
      margin-top: 90%;
      display: inline-block;
      text-align: center;
      box-sizing: border-box;
    }
  }

  .rightOpenOrClose-close {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
  }

  .rightOpenOrClose-open {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
  }
}